// * card 卡片样式
.my-card {
    box-sizing: border-box;
    padding: 20px;
    overflow-x: hidden;
    background-color: #ffffff;
    border: 1px solid #e4e7ed;
    border-radius: 4px;
    box-shadow: 0 0 12px rgb(0 0 0 / 5%);
}

.no-card {
    box-sizing: border-box;
    overflow-x: hidden;
}

.table-box {
    overflow: auto;
}

// * table 表格页面样式
.table-box,
.table-main {
    display: flex;
    flex: 1;
    flex-direction: column;
    width: 100%;
    height: 100%;
    //   height: calc(100% - 55px);
    min-width: 0;

    // table-search 表格搜索样式
    .table-search {
        padding: 18px 18px 0;
        margin-bottom: 10px;

        .el-form {

            .el-form-item {
                display: flex;

                > :nth-child(2) {
                    flex: 1;

                    .el-select {
                        width: 100%;
                    }
                }
            }

            .el-form-item__content>* {
                width: 100%;
            }

            // 去除时间选择器上下 padding
            .el-range-editor.el-input__wrapper {
                padding: 0 10px;
            }
        }

        .operation {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin-bottom: 18px;
        }
    }

    // 表格 header 样式
    .table-header {
        .header-button-lf {
            float: left;
        }

        .header-button-ri {
            float: right;
        }

        .el-button {
            margin-bottom: 15px;
        }
    }

    .table-container {
        overflow-y: auto;
        flex: 1;

        // el-table 表格样式
        .el-table {

            //   overflow-y: auto;
            // 修复 safari 浏览器表格错位 https://github.com/HalseySpicy/Geeker-Admin/issues/83
            table {
                width: 100%;
            }

            .el-table__header th {
                height: 45px;
                font-size: 15px;
                font-weight: bold;
                color: #303133;
                background: #f5f7fa;
            }

            .el-table__row {
                height: 45px;
                font-size: 14px;

                // .el-table__placeholder {
                //     display: inline;
                // }
            }

            // 设置 el-table 中 header 文字不换行，并省略
            .el-table__header .el-table__cell>.cell {
                white-space: nowrap;
            }

            // // 解决表格数据为空时样式不居中问题(仅在element-plus中)
            // .el-table__empty-block {
            //     position: absolute;
            //     top: 50%;
            //     left: 50%;
            //     transform: translate(-50%, -50%);

            //     .table-empty {
            //         line-height: 30px;
            //     }
            // }

            // table 中 image 图片样式
            .table-image {
                width: 50px;
                height: 50px;
                border-radius: 50%;
            }
        }


    }

    // 表格 pagination 样式
    .el-pagination {
        display: flex;
        justify-content: flex-end;
        margin-top: 20px;
    }
}